<template>
  <a-config-provider :locale="locale" :getPopupContainer="getPopupContainer">
    <div id="app">
      <router-view />
      <user-inactivity-detector />
    </div>
  </a-config-provider>
</template>

<script>
import { domTitle, setDocumentTitle } from '@/utils/domUtil'
import { i18nRender } from '@/locales'
import UserInactivityDetector from '@/components/UserInactivityDetector'
import { CURRENT_APP } from '@/store/mutation-types'
// 导入中文 locale
import zhCN from 'ant-design-vue/es/locale/zh_CN'

export default {
  components: {
    UserInactivityDetector,
  },
  data() {
    return {}
  },
  mounted() {
    console.log('window.__POWERED_BY_QIANKUN__', window, window.__POWERED_BY_QIANKUN__)
    // 监听全局事件
    this.$root.$on('app-change', (app) => {
      console.log('app-change', app)
      const appData = app || localStorage.getItem('currentApp')
      this.$store.commit(CURRENT_APP, appData)
      // 接口重新请求加上appName字段
    })
  },
  computed: {
    locale() {
      // 固定返回中文 locale，不再依赖语言切换
      const { title } = this.$route.meta
      title && setDocumentTitle(`${i18nRender(title)} - ${domTitle}`)

      // 直接返回中文 locale，不再从 store 中获取
      return zhCN
    },
  },
  methods: {
    getPopupContainer(el, dialogContext) {
      // 微应用中，弹窗挂载到微应用的容器中
      if (window.__POWERED_BY_QIANKUN__) {
        // 找到body下的沙箱子元素
        return document.querySelector('#app')
      }
      if (dialogContext) {
        return dialogContext.getDialogWrap()
      } else {
        return document.body
      }
    },
  },
}
</script>
